<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新商店电子商务网站</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="New Store Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900' rel='stylesheet' type='text/css'><!--//fonts-->
<!-- start menu -->
<link href="css/memenu.css" rel="stylesheet" type="text/css" media="all" />
<script type="text/javascript" src="js/memenu.js"></script>
<script>$(document).ready(function(){$(".memenu").memenu();});</script>
<script src="js/simpleCart.min.js"> </script>
</head>
<body>
<!--header-->
<div class="header">
	<div class="header-top">
		<div class="container">
			<div class="search">
					<form>
						<input type="text" value="搜索 " onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Search';}">
						<input type="submit" value="Go">
					</form>
			</div>
			<div class="header-left">		
					<ul>
						<li ><a class="lock"  href="login.jsp"  >登陆</a></li>
						<li><a class="lock" href="games.jsp"  >结账</a></li>
						<li>
</li>

					</ul>
					<div class="cart box_1">
						<a href="checkout.jsp">
						<h3> <div class="total">
							<span class="simpleCart_total"></span> (<span id="simpleCart_quantity" class="simpleCart_quantity"></span> 件商品)</div>
							<img src="images/cart.png" alt=""/></h3>
						</a>
						<p><a href="javascript:;" class="simpleCart_empty">清空购物车</a></p>

					</div>
					<div class="clearfix"> </div>
			</div>
				<div class="clearfix"> </div>
		</div>
		</div>
		<div class="container">
			<div class="head-top">
				<div class="logo">
					<a href="index.jsp"><img src="images/logo.png" alt=""></a>	
				</div>
		  <div class=" h_menu4">
				<ul class="memenu skyblue">
					  <li class="active grid"><a class="color8" href="index.jsp">首页</a></li>	
				      <li><a class="color1" href="#">购物</a>
				      	<div class="mepanel">
						<div class="row">
							<div class="col1">
								<div class="h_nav">
									<ul>
										<li><a href="products.jsp">配饰</a></li>
										<li><a href="products.jsp">包包</a></li>
										<li><a href="products.jsp">帽子</a></li>
										<li><a href="products.jsp">运动衫</a></li>
										<li><a href="products.jsp">夹克外套</a></li>
										<li><a href="products.jsp">牛仔裤</a></li>
										<li><a href="products.jsp">珠宝</a></li>
										<li><a href="products.jsp">羊毛衫</a></li>
										<li><a href="products.jsp">皮夹克</a></li>
										<li><a href="products.jsp">长袖T恤</a></li>
										<li><a href="products.jsp">休闲装</a></li>
									</ul>	
								</div>							
							</div>
							<div class="col1">
								<div class="h_nav">
									<ul>
										<li><a href="products.jsp">衬衫</a></li>
										<li><a href="products.jsp">运动鞋</a></li>
										<li><a href="products.jsp">短裤</a></li>
										<li><a href="products.jsp">西装</a></li>
										<li><a href="products.jsp">太阳镜</a></li>
										<li><a href="products.jsp">运动裤</a></li>
										<li><a href="products.jsp">泳装</a></li>
										<li><a href="products.jsp">斜纹棉布裤</a></li>
										<li><a href="products.jsp">T恤</a></li>
										<li><a href="products.jsp">内衣袜子</a></li>
										<li><a href="products.jsp">背心</a></li>
									</ul>	
								</div>							
							</div>
							<div class="col1">
								<div class="h_nav">
									<h4>受欢迎的品牌</h4>
									<ul>
										<li><a href="products.jsp">利维斯</a></li>
										<li><a href="products.jsp">派索</a></li>
										<li><a href="products.jsp">耐克</a></li>
										<li><a href="products.jsp">爱德温</a></li>
										<li><a href="products.jsp">新百伦</a></li>
										<li><a href="products.jsp">杰克琼斯</a></li>
										<li><a href="products.jsp">保罗史密斯</a></li>
										<li><a href="products.jsp">雷朋</a></li>
										<li><a href="products.jsp">阿迪达斯</a></li>
									</ul>	
								</div>												
							</div>
						  </div>
						</div>
					</li>
				    <li class="grid"><a class="color2" href="#">看书</a>
					  	<div class="mepanel">
						<div class="row">
							<div class="col1">
								<div class="h_nav">
									<ul>
										<li><a href="https://detail.tmall.com/item.htm?spm=a230r.1.14.1.36743a2fRGEZ6W&id=17302099374&ns=1&abbucket=20">《活着》</a></li>
										<li><a href="products.jsp">《我们仨》</a></li>
										<li><a href="products.jsp">《小王子》</a></li>
										<li><a href="products.jsp">《童年》</a></li>
										<li><a href="products.jsp">《呼啸山庄》</a></li>
										<li><a href="products.jsp">《飘》</a></li>
										<li><a href="products.jsp">《红与黑》</a></li>
										<li><a href="products.jsp">《悲惨世界》</a></li>
										<li><a href="products.jsp">《战争与和平》</a></li>
										<li><a href="products.jsp">《巴黎圣母院》</a></li>
										<li><a href="products.jsp">《四世同堂》</a></li>
									</ul>	
								</div>							
							</div>
							<div class="col1">
								<div class="h_nav">
									<ul>
										<li><a href="products.jsp">《平凡的世界》</a></li>
										<li><a href="products.jsp">《稻草人手记》</a></li>
										<li><a href="products.jsp">《花田半亩》</a></li>
										<li><a href="products.jsp">《围城》</a></li>
										<li><a href="products.jsp">《送你一颗子弹》</a></li>
										<li><a href="products.jsp">《呐喊》</a></li>
										<li><a href="products.jsp">《家》</a></li>
										<li><a href="products.jsp">《人生》</a></li>
										<li><a href="products.jsp">《百年孤独》</a></li>
										<li><a href="products.jsp">《基督山伯爵》</a></li>
										<li><a href="products.jsp">《过于喧器的孤独》</a></li>
									</ul>	
								</div>							
							</div>
							<div class="col1">
								<div class="h_nav">
									<h4>受欢迎的书籍</h4>
									<ul>
										<li><a href="products.jsp">《无解》</a></li>
										<li><a href="products.jsp">《新月集》</a></li>
										<li><a href="products.jsp">《老人与海》</a></li>
										<li><a href="products.jsp">《死灵魂》</a></li>
										<li><a href="products.jsp">《拖延心理学》</a></li>
										<li><a href="products.jsp">《梦的解析》</a></li>
										<li><a href="products.jsp">《宽容》</a></li>
										<li><a href="products.jsp">《影响力》</a></li>
										<li><a href="products.jsp">《策略思维》</a></li>
									</ul>	
								</div>												
							</div>
						  </div>
						</div>
			    </li>
				<li><a class="color4" href="blog.jsp">微博</a></li>				
				<li><a class="color6" href="contact.jsp">联系我们</a></li>
			  </ul> 
			</div>
				
				<div class="clearfix"> </div>
		</div>
		</div>

	</div>

	
<!--content-->
<!---->
		<div class="product">
			<div class="container">
				<div class="col-md-3 product-price">
					  
				<div class=" rsidebar span_1_of_left">
					<div class="of-left">
						<h3 class="cate">分类</h3>
					</div>
		 <ul class="menu">
		<li class="item1"><a href="#">男装 </a>
			<ul class="cute">
				<li class="subitem1"><a href="single.jsp">Cute Kittens </a></li>
				<li class="subitem2"><a href="single.jsp">Strange Stuff </a></li>
				<li class="subitem3"><a href="single.jsp">Automatic Fails </a></li>
			</ul>
		</li>
		<li class="item2"><a href="#">女装 </a>
			<ul class="cute">
				<li class="subitem1"><a href="single.jsp">Cute Kittens </a></li>
				<li class="subitem2"><a href="single.jsp">Strange Stuff </a></li>
				<li class="subitem3"><a href="single.jsp">Automatic Fails </a></li>
			</ul>
		</li>
		<li class="item3"><a href="#">童装</a>
			<ul class="cute">
				<li class="subitem1"><a href="single.jsp">Cute Kittens </a></li>
				<li class="subitem2"><a href="single.jsp">Strange Stuff </a></li>
				<li class="subitem3"><a href="single.jsp">Automatic Fails</a></li>
			</ul>
		</li>
		<li class="item4"><a href="#">配饰</a>
			<ul class="cute">
				<li class="subitem1"><a href="single.jsp">Cute Kittens </a></li>
				<li class="subitem2"><a href="single.jsp">Strange Stuff </a></li>
				<li class="subitem3"><a href="single.jsp">Automatic Fails</a></li>
			</ul>
		</li>
				
		<li class="item4"><a href="#">鞋类</a>
			<ul class="cute">
				<li class="subitem1"><a href="product.jsp">Cute Kittens </a></li>
				<li class="subitem2"><a href="product.jsp">Strange Stuff </a></li>
				<li class="subitem3"><a href="product.jsp">Automatic Fails </a></li>
			</ul>
		</li>
	</ul>
					</div>
				<!--initiate accordion-->
		<script type="text/javascript">
			$(function() {
			    var menu_ul = $('.menu > li > ul'),
			           menu_a  = $('.menu > li > a');
			    menu_ul.hide();
			    menu_a.click(function(e) {
			        e.preventDefault();
			        if(!$(this).hasClass('active')) {
			            menu_a.removeClass('active');
			            menu_ul.filter(':visible').slideUp('normal');
			            $(this).addClass('active').next().stop(true,true).slideDown('normal');
			        } else {
			            $(this).removeClass('active');
			            $(this).next().stop(true,true).slideUp('normal');
			        }
			    });
			
			});
		</script>
<!---->
	<div class="product-middle">
		
					<div class="fit-top">
						<h6 class="shop-top">最新热卖</h6>
						<a href="single.jsp" class="shop-now">立即购买</a>
<div class="clearfix"> </div>
	</div>
				</div>	 
						<div class="sellers">
							<div class="of-left-in">
								<h3 class="tag">标签</h3>
							</div>
								<div class="tags">
									<ul>
										<li><a href="#">设计</a></li>
										<li><a href="#">时尚</a></li>
										<li><a href="#">女神</a></li>
										<li><a href="#">定制</a></li>
										<li><a href="#">高端</a></li>
										<li><a href="#">重工</a></li>
										<li><a href="#">街头</a></li>
										<li><a href="#">日韩</a></li>
										<li><a href="#">嘻哈</a></li>
										<li><a href="#">简约</a></li>
										<li><a href="#">性感</a></li>
										<li><a href="#">休闲</a></li>
										
										<div class="clearfix"> </div>
									</ul>
								
								</div>
								
		</div>
				<!---->
				<div class="product-bottom">
					<div class="of-left-in">
								<h3 class="best">热销商品</h3>
							</div>
					<div class="product-go">
						<div class=" fashion-grid">
									<a href="single.jsp"><img class="img-responsive " src="images/TB1sfu2bC_I8KJjy0FoXXaFnVXa_!!0-item_pic.jpg_430x430q90.jpg" alt=""></a>
									
								</div>
							<div class=" fashion-grid1">
								<h6 class="best2"><a href="single.jsp" >挪威的森林</a></h6>
								
								<span class=" price-in1"> $40.00</span>
							</div>
								
							<div class="clearfix"> </div>
							</div>
							<div class="product-go">
						<div class=" fashion-grid">
									<a href="single.jsp"><img class="img-responsive " src="images/TB1sO6lKFXXXXXZXFXXXXXXXXXX_!!0-item_pic.jpg_430x430q90.jpg" alt=""></a>
									
								</div>
							<div class="fashion-grid1">
								<h6 class="best2"><a href="single.jsp" >人性的弱点</a></h6>
								
								<span class=" price-in1"> $40.00</span>
							</div>
								
							<div class="clearfix"> </div>
							</div>
					
				</div>
<div class=" per1">
				<a href="single.jsp" ><img class="img-responsive" src="images/pro.jpg" alt="">
				<div class="six1">
					<h4>折扣</h4>
					<p>多达</p>
					<span>60%</span>
				</div></a>
			</div>
				</div>
				<div class="col-md-9 product1">
				<div class=" bottom-product">
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi3.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
						<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>						
					</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi1.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi4.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					</div>
					<div class="clearfix"> </div>
				</div>
					<div class=" bottom-product">
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi5.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					
</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi1.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					</div>
					<div class="clearfix"> </div>
				</div>
					<div class=" bottom-product">
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi3.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
					<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					

					</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi4.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					
</div>
					<div class="col-md-4 bottom-cd simpleCart_shelfItem">
						<div class="product-at ">
							<a href="single.jsp"><img class="img-responsive" src="images/pi5.jpg" alt="">
							<div class="pro-grid">
										<span class="buy-in">现在购买</span>
							</div>
						</a>	
						</div>
						<p class="tun">It is a long established fact that a reader</p>
<a href="#" class="item_add"><p class="number item_price"><i> </i>$500.00</p></a>					
</div>
					<div class="clearfix"> </div>
				</div>
				
				</div>
		<div class="clearfix"> </div>
		<nav class="in">
				  <ul class="pagination">
					<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
					<li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
					<li><a href="#">2 <span class="sr-only"></span></a></li>
					<li><a href="#">3 <span class="sr-only"></span></a></li>
					<li><a href="#">4 <span class="sr-only"></span></a></li>
					<li><a href="#">5 <span class="sr-only"></span></a></li>
					 <li> <a href="#" aria-label="Next"><span aria-hidden="true">»</span> </a> </li>
				  </ul>
				</nav>
		</div>
		
		</div>
			
				<!---->

<!--//content-->
<div class="footer">
				<div class="container">
			<div class="footer-top-at">
			
				<div class="col-md-4 amet-sed">
				<h4>更多信息</h4>
				<ul class="nav-bottom">
						<li><a href="#">如何订购</a></li>
						<li><a href="#">常见问题</a></li>
						<li><a href="contact.jsp">位置</a></li>
						<li><a href="#">运送方式</a></li>
						<li><a href="#">会员身份</a></li>	
					</ul>	
				</div>
				<div class="col-md-4 amet-sed ">
				<h4>联系我们</h4>
					<p>电话:  +123456789</p>
					<ul class="social">
						<li><a href="#"><i> </i></a></li>						
						<li><a href="#"><i class="twitter"> </i></a></li>
						<li><a href="#"><i class="rss"> </i></a></li>
						<li><a href="#"><i class="gmail"> </i></a></li>
						
					</ul>
				</div>
				<div class="col-md-4 amet-sed">
					<h4>实时通讯</h4>
					<p>报名参加</p>
					<form>
						<input type="text" value="" onfocus="this.value='';" onblur="if (this.value == '') {this.value ='';}">
						<input type="submit" value="报名">
					</form>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
		<div class="footer-class">
		<p>版权 &copy; 2017<a target="_blank" href="http://www.moke8.com/">刘洁组</a></p>
		</div>
		</div>
</body>
</html>
